<form id="form">
<div class="modal-header">
	<button type="button" class="close" data-dismiss="modal">
		<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
	</button>
	<small class="modal-title">
	<#if model??>
		<i class="fa fa-pencil"></i> 编辑	
	<#else>
		<i class="fa fa-plus"></i> 新增
	</#if>
	</small>
</div>
<div class="modal-body" style="height:330px;overflow-y:auto;">
	<div class="tabs-container">
		<div class="form-horizontal clearfix">
			<input type="hidden" name="id" id="id" value="<#if model??>${model.id!''}</#if>"/>
			<input type="hidden" name="dictionaryId" id="dictionaryId" value="<#if model??>${model.dictionaryId}<#else>${dictionary.id}</#if>"/>
			<input type="hidden" id="dictionaryName" value="<#if model??>${model.dictionaryName}<#else>${dictionary.name}</#if>"/>
			<div class="col-sm-12">
				<div class="form-group">
					<label class="col-sm-3 control-label">上级：</label>
					<div class="col-sm-8 input-group" style="position:relative">
						<input name="parentId" id="parentId" type="hidden" value="<#if model??>${model.parentId}<#elseif parent??>${parent.id}<#else>0</#if>"/>
						<input id="parentName" type="text" onclick="showParent();" placeholder="请输入名称"
							readonly style="cursor: pointer;" class="form-control requiredIcon ignore" value="<#if model??>${model.parentName}<#elseif parent??>${parent.name}<#else>${dictionary.name}</#if>">
						<div id="parentContent" class="treeDiv">
							<ul id="parentTree" class="ztree" style="margin-top:0;"></ul>
						</div>
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-3 control-label">项目名称：</label>
					<div class="col-sm-8 input-group">
						<input name="name" id="name" type="text" placeholder="请输入项目名称"
							class="form-control requiredIcon" value="<#if model??>${model.name!''}</#if>">
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-3 control-label">项目值：</label>
					<div class="col-sm-8 input-group">
						<input name="code" id="code" type="text" placeholder="请输入项目值"
							class="form-control requiredIcon" value="<#if model??>${model.name!''}</#if>">
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-3 control-label">显示顺序：</label>
					<div class="col-sm-8 input-group">
						<input name="sort" id="sort" type="number" min="0" placeholder="请输入显示顺序"
							class="form-control requiredIcon" value="<#if model??>${model.sort!'0'}<#else>0</#if>">
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-3 control-label">选项：</label>
					<div class="col-sm-9" style="height:34px">
						<div class="checkbox checkbox-primary checkbox-inline">
                            <input name="enabled" id="enabled" type="checkbox" <#if !model?? || (model?? && model.enabled)>checked</#if> value="true">
                            <label for="enabled"> 启用 </label>
                        </div>
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-3 control-label">备注：</label>
					<div class="col-sm-8 input-group">
						<textarea name="remark" id="remark" rows="8" style="resize:vertical;" class="form-control" maxlength="200" placeholder="请输入备注信息"
						><#if model??>${model.remark!''}</#if></textarea>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div class="modal-footer">
	<button class="btn btn-white" data-dismiss="modal">关闭</button>
	<button class="btn btn-primary" type="submit">保存</button>
</div>
</form>


<script>
	$(function(){
		parentTree();
		
        var validator = $("#form").validate({
          ignore: ".ignore",
      	  rules: {
                name: {
                    required: true
                },
                code: {
                    required: true
                },
                sort: {
                	required: true
                }
            },
            messages: {
                name: {
                    required: icon + "请输入项目名称"
                },
                code: {
                    required: icon + "请输入项目值"
                },
                sort: {
                    required: icon + "请输入大于0的正整数"
                }
            },
            submitHandler: function(form){
            	var id = $("#id").val();
            	$(form).ajaxSubmit({
               		url:"${basePath}/dictionaryDetail/" + (id == "" ? "add" : "edit") ,
               	 	type:"POST",
               	 	dataType:"json",
               	 	data: {
               	 		// 特殊控件需要重新传递参数
               	 		enabled: $("#enabled").is(":checked")
               	 	},
               	 	success: function (resp) {
	               	 	if(resp.code == 0) {
	               	 		$("#formModal").modal("hide");
	                    	$("#list").treegrid("reload");
	                    	toastr.success("操作成功.","");
	                    }else if(resp.code == 1){
	                    	toastr.error("操作失败.","");
	                    }else {
	                    	toastr.error(resp.data, "");
	                    }
                 	}
                });    
            },
            showErrors: function(errorMap, errorList) {
          		this.defaultShowErrors();
          }
        });
        
	})
	
	// 上级下拉框初始化
	function parentTree(){
		var zNodes = [];
		
	    ajaxJson("${basePath}/dictionaryDetail/treeJson", {
	    	dictionaryId: $("#dictionaryId").val(),
	    	id: $("#id").val()
	    }, function(data){
	    	zNodes = data;
    	});
	    
	    zNodes.unshift({id:0, parentId:null, name:$("#dictionaryName").val(), isParent:true, open:true});

	    var setting = {
       		view: {
       			selectedMulti: false
       		},
       		data: {
       			simpleData: {
       				enable: true,
                    idKey: "id",
                    pIdKey: "parentId",
                    rootPid: null
       			}
       		},
       		callback: {
        		onClick: function(event, treeId, treeNode, clickFlag){
        			// 非取消选中
        			if(clickFlag > 0) {
        				$("#parentContent").fadeOut("fast");
        				$("#parentId").val(treeNode.id);
        				$("#parentName").val(treeNode.name);
        			}
        		}
        	}
       	};
        
        $.fn.zTree.init($("#parentTree"), setting, zNodes);
	}
	
	// 显示上级下拉框
	function showParent() {
		if($("#parentContent").is(":visible")) {
			$("#parentContent").hide();
		}else {
			var parentObj = $("#parentName");
			$("#parentContent").css({left:"0px", top:parentObj.outerHeight() + "px",height:"200px", width:parentObj.outerWidth() + "px" }).slideDown("fast");
		}
	}
	
	
	
	
</script>

